import { defineComponent } from 'vue';
import { terminalSelectorProps } from '@/main/js/terminalAttribute';
import styles from '../css/commonSelector.module.scss';

export default defineComponent({
  props: terminalSelectorProps(),
  setup(props, { emit }) {
    return () => (
      <div class={styles.commonSelector} style={{ width: props.width }}>
        <span>{props.label}：</span>
        <select class={styles.selectTravelCity} on-change={(e: Event) => emit('change', e)}>
          {props.selectOptions.map(item => {
            return (
              <option selected={props.selectVal === item.value} key={item.key}>
                {item.value}
              </option>
            );
          })}
        </select>
      </div>
    );
  }
});
